<!-- 选择类弹窗
     chooseList：类型列表
	 chooseTag：标志位，选择目的
	 chooseResult：选择结果，用于回显
	 -->
<template>
	<view class="zhezhao" @click="closeIt()">
		<view class="view-bottom" @click.stop="">
			<scroll-view class="choose-body" scroll-y="true">
				<view v-for="(item,index) in chooseList" :key="index">
					<view class="choose-body-item" @click="clickChoose(index)">
						
						<text :class="index==tabIndex ? 'list_item_s':'list_item'">{{item.name}}</text>
					</view>
					<view class="line" v-if="index!=chooseList.length-1"></view>
				</view>
				
			</scroll-view>
			<view class="view-bottom-s">
				<view class="view-bottom-b" @click="goIt">
					确定
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	let app = ''
	export default{
		props:{
			chooseList:{
				type:Array,
				default:[],
				
			},
			chooseTag:{
				type:String,
				default:""
			},
			chooseResult:{
				type:String,
				default:""
			}
		},
		data(){
			return{
				needAdapt:false,
				tabIndex:-1
				
			}
		},
		onLoad() {
			console.log('onLoad')
		},
		onShow() {
			console.log('onShow')
		},
		mounted() {
			console.log("---")
			app = getApp()
			var _this = this
			// console.log(_this.chooseList)
			_this.needAdapt = app.globalData.needAdapt && app.globalData.isIPhone
			for (var i = 0; i < _this.chooseList.length; i++) {
				if(_this.chooseResult==_this.chooseList[i]['value']){
					_this.tabIndex = i
				}
			}
		},
		methods:{
			
			/**
			 * 选择
			 */
			clickChoose(index){
				this.tabIndex = index
			},
			
			/**
			 * 确定
			 */
			goIt(){
				let _this = this
				if(this.tabIndex==-1){
					uni.showToast({
						title:'选项不能为空',
						icon:"none"
					})
					return
				}
				_this.$emit("gotIt",_this.chooseTag+';'+this.tabIndex)
			},
			
			closeIt(){
				this.$emit('closeIt')
			},
		}
	}
</script>

<style lang="scss">
	.zhezhao {
		width: 100%;
		height: 100vh;
		background: rgba(0, 0, 0, 0.4);
		z-index: 999;
		position: fixed;
		left: 0;
		top: 0;
		overflow: scroll;	
		// padding-top: 10vh;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.view-bottom{
		position: fixed;
		width: 100%;
		bottom: 0;
		background-color: #FFFFFF;
		padding-bottom: env(safe-area-inset-bottom); // 适配iphoneX的底部
	}
	.view-bottom-s{
		height: 108rpx;
		background-color: #FFFFFF;
		display: flex;
		align-items: center;
		border-top: 1rpx #eeeeee solid;
	}
	.view-bottom-b{
		width: 686rpx;
		height: 88rpx;
		background: #2DA9C5;
		border-radius: 58rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 36rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #E8F7FB;
		line-height: 50rpx;
		margin-left: 32rpx;
	}	
	.choose-body{
		height: 400rpx;
		background: #FFFFFF;
		border-radius: 16rpx 16rpx 0px 0px;
	}
	
	.choose-body-item{
		height: 100rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
	}
	.line{
		// width: 100%;
		background-color: #eeeeee;
		height: 1rpx;
		margin-left: 32rpx;
		margin-right: 32rpx;
	}
	.list_item_s{
		color: #2DA9C5;
	}
	.list_item{
		color: #333333;
	}
</style>